import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '@/store'

Vue.use(VueRouter)

// 总结:
// 路由懒加载: 为了让第一个页面, 加载的app.js小一点, 打开网页快一点
// 思路: 把组件对应js, 分成若干个.js, 路由切换到哪个页面, 才去加载对应的.js文件
// 原因: webpack分析入口时, 发现router里上来就import所有页面, 所以直接打包进app.js->很大
// 解决: 当路由路径匹配规则时, 才现去import引入对应的组件js文件
const routes = [
  {
    path: '/',
    redirect: '/login' // 重定向会改变地址栏里路由地址，然后导致路由重新匹配
  },
  {
    path: '/login',
    // 路由懒加载：webpack提供import函数，可以在路由路径匹配后，再去引入对应的组件
    component: () => import('@/views/Login/index.vue'),
    // 路由独享守卫
    beforeEnter (to, from, next) {
      if (store.state.token?.length > 0) {
        // next(false)
        // 问题: 你手动修改url路由路径, next(false)会给你跳转回form页面
        // 产生一次历史记录, 导致你的返回按钮, $router.back()失效
        // 返回登录页, 回不去

        // 解决:
        // 1. 想要进登录页不留在原地了, 而是返回首页
        next('/layout/home')
        // 2. 移动端App也没有地址栏, 不必特别纠结返回按钮
      } else {
        next() // 其他情况通通放行
      }
    }
  },
  {
    path: '/layout',
    component: () => import('@/views/Layout/index.vue'),
    // 重定向  默认显示二级页面为home首页
    redirect: '/layout/home',
    children: [
      {
        // path: '', 将二级路由路径设置为空，layout打开会默认重定向为/layout/home界面
        path: 'home',
        component: () => import('@/views/Home/index.vue'),
        meta: {
          scrollT: 0// 保留首页离开时，滚动条的位置
        }
      },
      {
        path: 'user',
        component: () => import('@/views/User/index.vue')
      }

    ]
  },
  {
    path: '/search',
    component: () => import('@/views/Search/index.vue')
  },
  // 搜索详情页
  {
    path: '/search/:keyWords',
    component: () => import('@/views/Search/SearchResult.vue')
  },
  {
    path: '/article_detail',
    component: () => import('@/views/ArticleDetail/index.vue')
  },
  {
    path: '/user_editor',
    component: () => import('@/views/User/UserEdit.vue')
  },
  {
    path: '/chat',
    component: () => import('@/views/Chat/index.vue')
  }

]

const router = new VueRouter({
  routes
})
// router.beforeEach((to, from, next) => {
//   // 有token, 不能去登录页
//   // 无token, 需要用户"权限"的才需要去登录页
//   if (store.state.token.length > 0 && to.path === '/login') {
//     // 证明有token-已经登录了
//     next('/layout/home') // 阻止跳转原地呆着
//   } else {
//     next()
//   }
// })

export default router
